﻿/**
* Скрипт отображающий панель управления содержимым главной страницы
*/
var container = Ext.getCmp(sectionId);
Ext.onReady(function () {
    var homepagePanel = {
        xtype: 'tabpanel',
        deferredRender: false,
        activeTab: 0,
        items: [
            {
                title: 'Топ категории',
                layout: 'fit',
                items: [
                    {
                        xtype:'grid',
                        id: 'homepageTopCategoriesGrid',
                        frame: true,
                        store: new Ext.data.JsonStore({
                            root: 'data',
                            idProperty: 'id',
                            fields: [
                               'id',
                               'categoryId',
                               'displayName',
                               'sequence'
                            ]
                        }),
                        colModel: new Ext.grid.ColumnModel({
                            columns: [
                                {
                                    header: 'ИД записи',
                                    dataIndex: 'id',
                                    width: 80,
                                    id: 'topCategoriesIdColumn'
                                },
                                {
                                    header: 'ИД категории',
                                    dataIndex: 'categoryId',
                                    width: 120,
                                    id: 'topCategoriesCategoryIdColumn'
                                },
                                {
                                    header: 'Имя категории',
                                    dataIndex: 'displayName',
                                    width: 120,
                                    id: 'topCategoriesDisplayNameColumn'
                                },
                                {
                                    header: 'Порядок отображения',
                                    dataIndex: 'sequence',
                                    width: 170,
                                    id: 'topCategoriesSequenceColumn'
                                }
                            ]
                        }),
                        autoExpandColumn: 'topCategoriesDisplayNameColumn',
                        selModel: new Ext.grid.RowSelectionModel({

                        }),
                        tbar: [
                            {
                                text: 'Обновить список',
                                handler: function(){

                                }
                            },
                            '-',
                            {
                                text: 'Добавить',
                                tooltip: 'Отображает диалог добавления новой топ категории на главную страницу',
                                handler: function(){

                                }
                            },
                            {
                                text: 'Редактировать',
                                tooltip: 'Отображает диалог редактирования выбранной топ категории на главную страницу',
                                handler: function(){

                                }
                            },
                            {
                                text: 'Удалить',
                                tooltip: 'Удаляет выбранную топ категорию с главной страницы',
                                handler: function(){

                                }
                            }
                        ]
                    }
                ]
            },
            {
                title: 'Баннеры',
                layout: 'fit',
                items: [
                    {
                        xtype: 'panel',
                        frame: false,
                        tbar: [
                            {
                                text: 'Обновить список',
                                handler: function(){
                                    reloadHomePageBanners();
                                }
                            },
                            '-',
                            {
                                text: 'Добавить',
                                tooltip: 'Отображает диалог добавления баннера на главную страницу',
                                handler: function(){
                                    showBannerImageDialog();
                                }
                            },
                            {
                                text: 'Редактировать',
                                tooltip: 'Отображает диалог редактирования баннера на главной странице',
                                handler: function(){
                                    var selectedRecords = Ext.getCmp('homePageBanners').getSelectedRecords();
                                    if (selectedRecords.length == 0){
                                        return;
                                    }
                                    showBannerImageDialog(selectedRecords[0]);
                                }
                            },
                            {
                                text: 'Удалить',
                                tooltip: 'Удаляет баннер с главной страницы',
                                handler: function(){
                                    var selectedRecords = Ext.getCmp('homePageBanners').getSelectedRecords();
                                    if (selectedRecords.length == 0){
                                        return;
                                    }
                                    var selectedId = selectedRecords[0].data.id;
                                    deleteHomePageElement(selectedId, function(){
                                        reloadHomePageBanners();
                                    });
                                }
                            }
                        ],
                        items: [
                            {
                                xtype: 'dataview',
                                id: 'homePageBanners',
                                frame: true,
                                store: new Ext.data.JsonStore({
                                    root: 'data',
                                    idProperty: 'id',
                                    fields: [
                                        'id',
                                        'photoURL',
                                        'realURL',
                                        'URL',
                                        'hidden',
                                        'region',
                                        'sequence',
                                        'title'
                                    ]
                                }),
                                height: 400,
                                autoHeight: false,
                                bodyStyle: 'padding: 5px',
                                autoScroll: false,
                                multiSelect: false,
                                tpl: new Ext.XTemplate(
                                    '<tpl for=".">',
                                        '<div class="thumb-wrap" id="banner-{id}">',
                                        '<div class="bannerThumb"><img src="{realURL}" title="{title}"></div>',
                                        '<div align="center" class="x-editable">{title}</div></div>',
                                    '</tpl>',
                                    '<div class="x-clear"></div>'
                                ),
                                overClass:'x-view-over',
                                itemSelector:'div.thumb-wrap',
                                selectedClass: 'dataview-selected',
                                emptyText: '<center>Нет данных для отображения</center>',
                                singleSelect: true
                            }
                        ]
                    }
                ],
                listeners: {
                    activate: function(sender){
                        reloadHomePageBanners();
                    }
                }
            },
            {
                title: 'Топ магазины',
                layout: 'fit',
                items: [
                    {
                        xtype:'grid',
                        id: 'homePageTopShopsGrid',
                        frame: true,
                        store: new Ext.data.JsonStore({
                            root: 'data',
                            idProperty: 'id',
                            fields: [
                               'id',
                               'shopId',
                               'displayName',
                               'sequence'
                            ]
                        }),
                        colModel: new Ext.grid.ColumnModel({
                            columns: [
                                {
                                    header: 'ИД записи',
                                    dataIndex: 'id',
                                    width: 80,
                                    id: 'topShopsIdColumn'
                                },
                                {
                                    header: 'ИД магазина',
                                    dataIndex: 'categoryId',
                                    width: 120,
                                    id: 'topShopsShopIdColumn'
                                },
                                {
                                    header: 'Имя магазина',
                                    dataIndex: 'displayName',
                                    width: 120,
                                    id: 'topShopsDisplayNameColumn'
                                },
                                {
                                    header: 'Порядок отображения',
                                    dataIndex: 'sequence',
                                    width: 170,
                                    id: 'topShopsSequenceColumn'
                                }
                            ]
                        }),
                        autoExpandColumn: 'topShopsDisplayNameColumn',
                        selModel: new Ext.grid.RowSelectionModel({

                        }),
                        tbar: [
                            {
                                text: 'Обновить список',
                                handler: function(){

                                }
                            },
                            '-',
                            {
                                text: 'Добавить',
                                tooltip: 'Отображает диалог добавления нового топ магазина на главную страницу',
                                handler: function(){

                                }
                            },
                            {
                                text: 'Редактировать',
                                tooltip: 'Отображает диалог редактирования выбранного топ магазина на главную страницу',
                                handler: function(){

                                }
                            },
                            {
                                text: 'Удалить',
                                tooltip: 'Удаляет выбранный топ магазин с главной страницы',
                                handler: function(){

                                }
                            }
                        ]
                    }
                ]
            },
            {
                title: 'Топ торговые центры',
                layout: 'fit',
                items: [
                    {
                        xtype:'grid',
                        id: 'homePageTopShoppingMallsGrid',
                        frame: true,
                        store: new Ext.data.JsonStore({
                            fields: [
                               'id',
                               'mallId',
                               'displayName',
                               'sequence'
                            ]
                        }),
                        colModel: new Ext.grid.ColumnModel({
                            columns: [
                                {
                                    header: 'ИД записи',
                                    dataIndex: 'id',
                                    width: 80,
                                    id: 'topMallsIdColumn'
                                },
                                {
                                    header: 'ИД центра',
                                    dataIndex: 'categoryId',
                                    width: 120,
                                    id: 'topMallsMallIdColumn'
                                },
                                {
                                    header: 'Имя торгового центра',
                                    dataIndex: 'displayName',
                                    width: 120,
                                    id: 'topMallsDisplayNameColumn'
                                },
                                {
                                    header: 'Порядок отображения',
                                    dataIndex: 'sequence',
                                    width: 170,
                                    id: 'topMallsSequenceColumn'
                                }
                            ]
                        }),
                        autoExpandColumn: 'topMallsDisplayNameColumn',
                        selModel: new Ext.grid.RowSelectionModel({

                        }),
                        tbar: [
                            {
                                text: 'Обновить список',
                                handler: function(){

                                }
                            },
                            '-',
                            {
                                text: 'Добавить',
                                tooltip: 'Отображает диалог добавления нового торгового центра на главную страницу',
                                handler: function(){

                                }
                            },
                            {
                                text: 'Редактировать',
                                tooltip: 'Отображает диалог редактирования выбранного торгового центра на главную страницу',
                                handler: function(){

                                }
                            },
                            {
                                text: 'Удалить',
                                tooltip: 'Удаляет выбранный торговый центр с главной страницы',
                                handler: function(){

                                }
                            }
                        ]
                    }
                ]
            }
        ]
    };

container.add(homepagePanel);
container.doLayout();

    /**
     * перезагружает список баннеров на главной странице
     */
    function reloadHomePageBanners(){
        global.Ajax({
            url: '/ControlPanel/ManageHomePage/GetBanners',
            maskEl: Ext.getCmp('homePageBanners'),
            maskMsg: 'Идет загрузка списка баннеров',
            success: function(data){
                Ext.getCmp('homePageBanners').getStore().loadData(data);
            }
        });
    }

    /**
     * Отображает диалог добавления или редактирования баннера на главную
     * @param bannerImage
     */
    function showBannerImageDialog(bannerImage){
        var wnd = new Ext.Window({
            title: bannerImage != undefined ? "Редактирование баннера "+bannerImage.data.title : "Добавления баннера на главную",
            width: 300,
            items: [
                {
                    xtype: 'form',
                    id: 'bannerImageForm',
                    fileUpload: true,
                    standardSubmit: false,
                    bodyStyle: 'padding: 5px',
                    labelAlign: 'top',
                    items: [
                        {
                            xtype: 'hidden',
                            id: 'bannerIdField',
                            name: 'id',
                            value: bannerImage != undefined ? bannerImage.data.id : -1
                        },
                        {
                            xtype: 'textfield',
                            id: 'bannerTitleField',
                            name: 'title',
                            fieldLabel: 'Заголовок',
                            allowBlank: false,
                            anchor: '100%',
                            value: bannerImage != undefined ? bannerImage.data.title : ""
                        },
                        {
                            xtype: 'textfield',
                            id: 'bannerURLField',
                            name: 'url',
                            fieldLabel: 'URL',
                            allowBlank: true,
                            anchor: '100%',
                            value: bannerImage != undefined ? bannerImage.data.URL : ""
                        },
                        {
                            xtype: 'textfield',
                            id: 'bannerPhotoURLField',
                            name: 'photoURL',
                            fieldLabel: 'URL изображения',
                            allowBlank: true,
                            anchor: '100%',
                            value: bannerImage != undefined ? bannerImage.data.photoURL : ""
                        },
                        {
                            xtype: 'textfield',
                            id: 'bannerRegionField',
                            name: 'region',
                            fieldLabel: 'Регион',
                            allowBlank: true,
                            anchor: '100%',
                            value: bannerImage != undefined ? bannerImage.data.region : ""
                        },
                        {
                            xtype: 'numberfield',
                            id: 'bannerSequenceField',
                            name: 'sequence',
                            fieldLabel: 'Порядок для сортировки',
                            allowBlank: false,
                            anchor: '100%',
                            value: bannerImage != undefined ? bannerImage.data.sequence : 0
                        },
                        {
                            xtype: 'checkbox',
                            id: 'bannerHiddenField',
                            name: 'bannerHidden',
                            hideLabel: true,
                            anchor: '100%',
                            boxLabel: 'Скрыта',
                            checked: bannerImage != undefined ? bannerImage.data.hidden : false
                        },
                        new Ext.ux.form.FileUploadField({
                            fieldLabel: bannerImage != undefined ? "Загрузка фотографии на замену" : "Выберите фотографию для загрузки",
                            id: 'bannerFileField',
                            buttonText: 'Выбрать',
                            anchor: '100%',
                            name: 'bannerImage'
                        })
                    ]
                }
            ],
            buttons: [
                {
                    text: 'Сохранить',
                    handler: function(){
                        // Валидируем
                        var form = Ext.getCmp('bannerImageForm').getForm();
                        if (!form.isValid()){
                            Ext.msg.alert('Ошибка валидации','Пожалуйста правильно заполните все необходимые поля');
                            return;
                        }

                        // Отправляем
                        form.submit({
                            url: '/ControlPanel/ManageHomePage/SaveBanner',
                            clientValidation: true,
                            success: function(form,action){
                                // Успешно сохранили
                                wnd.close();
                                reloadHomePageBanners();
                            },
                            failure: function(form,action){
                                wnd.close();
                                reloadHomePageBanners();
                            }
                        });
                    }
                },
                {
                    text: 'Закрыть',
                    handler: function(){
                        wnd.close();
                    }
                }
            ]
        });
        wnd.show();
    }

    /**
     * Отображает стандартный диалог удаления элемента с главной страницы
     * @param elementId - идентификатор элемента
     * @param callbackFunction - функция, выполняемая после того как сервер сообщил об успешном удалении
     */
    function deleteHomePageElement(elementId,callbackFunction){
        Ext.Msg.show({
            title: 'Удаление элемента',
            msg: 'Вы действительно хотите удалить этот элемент с главной страницы?',
            buttons: Ext.Msg.YESNO,
            icon: Ext.Msg.QUESTION,
            fn: function(txt){
                if (txt == "yes"){
                    global.Ajax({
                        url: '/ControlPanel/ManageHomePage/DeleteElement',
                        params: {id: elementId},
                        maskEl: homepagePanel,
                        maskMsg: 'Идет удаление элемента',
                        success: function(data){
                            if (callbackFunction != undefined){
                                callbackFunction();
                            }
                        }
                    });
                }
            }
        });
    }

});